{% extends "基础.html" %}

{% block 标题 %}
  草蟒问答 - 注册
{% endblock %}

{% block 头部 %}
  <script src="{{ 构造url('静态', 文件名='js/jquery-3.6.0.min.js') }}"></script>
  <script src="{{ 构造url('静态', 文件名='js/注册.js') }}"></script>
{% endblock %}

{% block 主体 %}
<div class="row">
  <div class="col"></div>
  <div class="col-6">
    <form method="post", action="{{ 构造url('用户.注册') }}">
      {{ 表单.csrf_token }}
  <div class="mb-3">
    <label for="电子邮箱" class="form-label">电子邮箱</label>
    <input type="email" class="form-control" name="电子邮箱" aria-describedby="emailHelp">
    <div id="emailHelp" class="form-text">我们不会将您的电子邮箱用于任何其他目的</div>
    <div class="mb-3 text-danger">
      {% for msg in 表单.电子邮箱.错误々 %}
      <p>{{ msg }}</p>
      {% endfor %}
    </div>
  </div>
  <div class="mb-3">
    <label for="验证码" class="form-label">验证码</label>
    <div class="input-group">
      <input type="text" class="form-control" name="验证码">
      <button class="btn btn-secondary" type="button" id="获取验证码">获取验证码</button>
    </div>
    <div class="mb-3 text-danger">
      {% for msg in 表单.验证码.错误々 %}
      <p>{{ msg }}</p>
      {% endfor %}
    </div>
  </div>
  <div class="mb-3">
    <label for="用户名" class="form-label">用户名</label>
    <input type="text" class="form-control" name="用户名">
  </div>
  <div class="mb-3 text-danger">
    {% for msg in 表单.用户名.错误々 %}
    <p>{{ msg }}</p>
    {% endfor %}
  </div>
  <div class="mb-3">
    <label for="密码" class="form-label">密码</label>
    <input type="password" class="form-control" name="密码">
  </div>
  <div class="mb-3 text-danger">
    {% for msg in 表单.密码.错误々 %}
    <p>{{ msg }}</p>
    {% endfor %}
  </div>
  <div class="mb-3">
    <label for="确认密码" class="form-label">确认密码</label>
    <input type="password" class="form-control" name="确认密码">
  </div>
  <div class="mb-3 text-danger">
    {% for msg in 表单.错误々 %}
    <p>{{ msg }}</p>
    {% endfor %}
  </div>
  <div class="d-grid">
    <button type="submit" class="btn btn-primary">立即注册</button>
  </div>
    </form>
  </div>
  <div class="col"></div>
</div>
{% endblock %}